<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" isELIgnored="false"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Add Food</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js" ></script>
<script type="text/javascript" src="monitor.js" ></script>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet"
	href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"
	integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
	crossorigin="anonymous">

<!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
<link rel="stylesheet"
	href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"
	integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp"
	crossorigin="anonymous">

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script
	src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"
	integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
	crossorigin="anonymous"></script>
<style type="text/css">
@CHARSET "UTF-8";
body {
	background-color: honeydew;
}

#wrapper {
	width: 480px;
	height: 600px;
	padding: 10px;
	margin-top: 2%;
	margin-left: 37%;
	margin-right: auto;
	display: block;
}
#addform{
	font: 1em Georgia, serif;
}

.form-group{
	margin-left: 10px;
	margin-top: 30px;
	padding-top:10px;
}

#fname{
	width:150px;
	text-align:left;
	padding-left:13px;
}
#ftype{
	width:150px;
	text-align:left;
	padding-left:13px;
}
#fprice{
	width:150px;
	text-align:left;
	padding-left:13px;
}
#fimage{
	width:180px;
	text-align:left;
	padding-left:13px;
}
.pic{
	width:280px;	
}
button {
	margin-left: 5%;
}
#back-box {
	margin-top: 20px;
	text-align: center;
}

a {
	font: bold 1.2em Gseorgia, serif;
	margin-left: 39%;
	text-decoration: none;
}

#back-box a:hover {
	color: #ff7d0a;
}

#back-box a:active {
	color: #ee7204;
}

</style>
</head>
<body>
	<div class="page-header" style="text-align: center;font:italic 1em Georgia, serif;">
		<h1 style="color: cadetblue;font:bold">ADD Food</h1>
		<h3>Current Merchant: ${name }</h3>
	</div>

	<div id="wrapper">
		<form class="form-horizontal" id="addform" action="addfood"
			method="post" enctype="multipart/form-data">
			<input type="hidden" name="icnum" id="icnum"  value="${sessionScope.icnum }"/>
			<div class="form-group">
				<label for="exampleInputName2" id="fname" class="col-sm-2 control-label">Food
					Name</label>
				<div class="col-sm-10">
					<input name="fname" type="text" class="form-control"
						id="exampleInputName2" placeholder="Food Name">
				</div>
			</div>
			<div class="form-group">
				<label for="exampleInputName2" id="ftype"class="col-sm-2 control-label">Food
					Type</label> 
				<div class="col-sm-10">
					<select name="ftype" class="form-control">
						<option value="1">Drinks</option>
						<option value="2">Staple food</option>
						<option value="3">Snack</option>
						<option value="4">Combo</option>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label for="exampleInputName2" id="fprice"
					class="col-sm-2 control-label">Food Price</label>
				<div class="col-sm-10">
					<input name="fprice" placeholder="Food Price" type="text" class="form-control"
						id="exampleInputName2">
				</div>
			</div>
			<div class="form-group">
				<label for="exampleInputFile" id="fimage"
					class="col-sm-2 control-label">Upload Food Image</label>
				<div class="col-sm-10 pic">
					<input name="fimage" type="file" id="exampleInputFile"> <span
						class="help-block">Choose Food Image here.</span>
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="submit" class="btn btn-success btn-lg" style="width:200px;">ADD Food</button>
				</div>
			</div>
		</form>
		<div class="back-box">
			<a href="foodlist">Back</a>
		</div>
	</div>
</body>
</html>